<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>已办任务</title>
    <link rel="stylesheet" href="../static/css/reset.css">
    <link rel="stylesheet" href="../static/plus/eleme.css">
    <link rel="stylesheet" href="../static/css/style_xia.css">
</head>
<body>
<div id="app" class="work-done">
    <mt-header fixed title="已办任务">
        <mt-button slot="left" icon="back" @click="goBack"></mt-button>
    </mt-header>
    <section class="content">
        <div class="search font-14">
            <div class="item" @click="isShowBtnModel = true">
                <label class="label" for="">任务类型</label>
                <span class="text" v-text="searchType"></span>
                <img class="icon" src="../static/images/icon/down.png" alt="">
            </div>
            <div class="item">
                <label class="label" for="">任务信息</label>
                <input class="text" type="text" placeholder="请输入">
                <button class="btn" @click="search">搜索</button>
            </div>
        </div>

        <div class="list-box">
            <v-work-done :work-list="workList"></v-work-done>
        </div>

        <!--数量选择器-->
        <div class="custom-picker" v-show="isShowBtnModel">
            <transition name="btnModel">
                <div class="picker-box">
                    <div class="btns">
                        <button @click="isShowBtnModel = false">取消</button>
                        <button @click="isShowBtnModel = false">确认</button>
                    </div>
                    <mt-picker :slots="numberSlot" @change="onNumberChange" :visible-item-count="3"></mt-picker>
                </div>
            </transition>
        </div>
    </section>
    <v-footer></v-footer>
    <!--loading-->
    <div class="loading" v-show="isShow">
        <mt-spinner :type="0" :size="60"></mt-spinner>
    </div>
</div>
</body>
<script src="../static/plus/vue.js"></script>
<script src="../static/plus/eleme.js"></script>
<script src="../static/js/common.js"></script>
<script>
    window.onload = function () {
        var vm = new Vue({
            el: '#app',
            data: {
                isShowBtnModel:false,
                isShow:true,
                numberSlot: [{
                    flex: 1,
                    values:  ["党建学习资料申请发布流程", "短期外出流程", "会议安排流程", "数据拷出申请流程", "销假申请流程", "新闻发布流程", "休假申请流程", "因私出国（境）流程", "用车申请流程"],
                    className: 'slot1'
                }],
                isActive: null,
                workList: [
                    {
                        id: 4343,
                        workName: "会议安排流程",
                        workStatus: 1,
                        author: "王斌",
                        sendTime: "2018-03-08 14:33",
                        startTime: "2018-03-08 15:33",
                        type: 1,
                        workInfo: "2018年11周工作安排"
                    },
                    {
                        id: 4343,
                        workName: "会议安排流程",
                        workStatus: 1,
                        author: "王斌",
                        sendTime: "2018-03-08 14:33",
                        startTime: "2018-03-08 15:33",
                        type: 1,
                        workInfo: "2018年10周工作安排"
                    },
                    {
                        id: 4343,
                        workName: "会议安排流程",
                        workStatus: 1,
                        author: "王斌",
                        sendTime: "2018-03-08 14:33",
                        startTime: "2018-03-08 15:33",
                        type: 1,
                        workInfo: "2018年9周工作安排"
                    },
                    {
                        id: 4343,
                        workName: "会议安排流程",
                        workStatus: 1,
                        author: "王斌",
                        sendTime: "2018-03-08 14:33",
                        startTime: "2018-03-08 15:33",
                        type: 1,
                        workInfo: "2018年8周工作安排"
                    },
                    {
                        id: 4343,
                        workName: "会议安排流程",
                        workStatus: 1,
                        author: "王斌",
                        sendTime: "2018-03-08 14:33",
                        startTime: "2018-03-08 15:33",
                        type: 1,
                        workInfo: "2018年7周工作安排"
                    }
                ],
                statusCode: ["已提交", "已完成", "已终止"],
                typeCode: ["已提交", "被终止"],
                showModel: false,
                searchType: "请选择"
            },
            methods: {
                onNumberChange(picker,values) {
                  this.searchType = values[0];
                },
                changeType(index) {

                },
                selectWorkType() {
                    this.showModel = true;
                },
                search() {

                },
                goBack() {
                    history.go(-1);
                }
            },
            created() {

            },
            mounted() {
                setSectionHeight();
                this.isShow = false;
            }
        })
    }
</script>
</html>